<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>登录</title>
    <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/signin.css"/>
    <!-- CSS -->
</head>
<body>
<div class="container">
    <form class="form-signin" method="post" action="/login">
        <h2 class="form-signin-heading">账号登录</h2>
        <p>
            <label for="username" class="sr-only">Username</label>
            <input type="text" id="username" name="username" class="form-control" placeholder="用户名" required
                   autofocus>
        </p>
        <p>
            <label for="password" class="sr-only">Password</label>
            <input type="password" id="password" name="password" class="form-control" placeholder="密码" required>
        </p>
        <button class="btn btn-lg btn-primary btn-block" type="submit">账号登录</button>
    </form>

    <form class="form-signin" method="post" action="/login/phone">
        <h2 class="form-signin-heading">手机号密码</h2>
        <p>
            <label for="phone" class="sr-only">手机号</label>
            <input type="text" id="phone" name="phone" class="form-control" placeholder="手机号" required
                   autofocus>
        </p>
        <p>
            <label for="phone-password" class="sr-only">密码</label>
            <input type="password" id="phone-password" name="password" class="form-control" placeholder="密码" required>
        </p>
        <div>
            <button class="w-100 btn btn-lg btn-primary btn-block" type="submit"> 手机号密码</button>
            <div th:each="t:${registration}">
                <a class="w-100 btn btn-light btn-block bg-white" th:href="'/oauth2/authorization/'+${t}" role="link"
                   style="margin-top: 10px">
                    <img th:if="${t.equals('github')}" src="/img/github.png" th:src="@{/img/github.png}" width="24"
                         style="margin-right: 5px;" alt="Sign in with Github">
                    <img th:if="${t.equals('google')}" src="/img/google.png" th:src="@{/img/google.png}" width="24"
                         style="margin-right: 5px;" alt="Sign in with Google">
                    <div th:unless="${t.equals('google') || t.equals('github')}" th:text="${t}"></div>
                </a>
            </div>
        </div>
    </form>
    </table>
</div>
<script>

</script>
</body>
</html>